import { _decorator, Component, Node, Label, Button, NodeEventType, Vec3 } from 'cc';
import { PopupBase } from './PopupBase';
const { ccclass, property } = _decorator;

/** 
 * 对话框弹窗选项 
 */
export interface PopupDialogOptions {
    title: string; // 标题
    content: string; // 内容
    confirmText: string; // 确认按钮文本内容
    cancelText?: string | null; // 确认按钮文本内容
    confirmCallback: Function; // 确认事件回调
    cancelCallback?: Function; // 取消事件回调
}

/**
 * 对话框弹窗
 */
@ccclass('PopupDialog')
export class PopupDialog extends PopupBase<PopupDialogOptions> {

    // 标题文本
    @property(Label)
    public titleLabel: Label | null = null;
    // 内容文本
    @property(Label)
    public contentLabel: Label | null = null;
    // 确认按钮内容文本框
    @property(Label)
    public confirmLabel: Label | null = null;
    // 取消按钮内容文本框
    @property(Label)
    public cancelLabel: Label | null = null;
    // 确认按钮
    @property(Node)
    public confirmBtn: Node | null = null;
    // 取消按钮
    @property(Node)
    public cancelBtn: Node | null = null;

    protected onLoad() {
        this.init();
        this.registerEvent();
    }

    protected onDestroy() {
        this.unregisterEvent();
    }

    protected init() {
        this.titleLabel = this.node.getChildByPath('DialogMain/Title')?.getComponent(Label) || null;
        this.contentLabel = this.node.getChildByPath('DialogMain/Content')?.getComponent(Label) || null;
        this.confirmLabel = this.node.getChildByPath('DialogMain/ButtonArea/Confirm/Label')?.getComponent(Label) || null;
        this.cancelLabel = this.node.getChildByPath('DialogMain/ButtonArea/Cancel/Label')?.getComponent(Label) || null;
        this.confirmBtn = this.node.getChildByPath('DialogMain/ButtonArea/Confirm');
        this.cancelBtn = this.node.getChildByPath('DialogMain/ButtonArea/Cancel');
        // 父级组件
        this.main = this.node.getChildByPath('DialogMain');
        this.background = this.node.getChildByPath('DialogBg');
        this.blocker = this.node.getParent()?.getChildByPath('Blocker') || null;
    }

    private registerEvent() {
        // 确认按钮动画与监听
        this.confirmBtn?.on(NodeEventType.TOUCH_START, () => {
            this.confirmBtn?.setScale(new Vec3(1.1, 1.1, 1));
        }, this);
        this.confirmBtn?.on(NodeEventType.TOUCH_END, this.onConfirmBtnClick, this);
        // 取消按钮动画与监听
        this.cancelBtn?.on(NodeEventType.TOUCH_START,  () => {
            this.cancelBtn?.setScale(new Vec3(1.1, 1.1, 1));
        }, this);
        this.cancelBtn?.on(NodeEventType.TOUCH_END, this.onCancelBtnClick, this);
    }

    private unregisterEvent() {
        this.confirmBtn?.targetOff(this);
        this.cancelBtn?.targetOff(this);
    }

    protected updateDisplay(options: PopupDialogOptions): void {
        if (this.titleLabel) this.titleLabel.string = options.title;
        if (this.contentLabel) this.contentLabel.string = options.content;
        if (this.confirmLabel) this.confirmLabel.string = options.confirmText;
        if (options.cancelText == null) {
            if (this.cancelBtn) this.cancelBtn.active = false;
        } else {
            if (this.cancelBtn) this.cancelBtn.active = true;
            if (this.cancelLabel) this.cancelLabel.string = options.cancelText;
        }
    }

    /**
     * 确认按钮回调
     */
    protected onConfirmBtnClick() {
        this.confirmBtn?.setScale(new Vec3(1, 1, 1));
        this.options?.confirmCallback && this.options?.confirmCallback();
        this.hide();
    }

    /**
     * 取消按钮回调
     */
    protected onCancelBtnClick() {
        this.cancelBtn?.setScale(new Vec3(1, 1, 1));
        this.options?.cancelCallback && this.options?.cancelCallback();
        this.hide();
    }

}

